﻿/*-----------------------------------/
/* Create By.Ben 20181206
/*----------------------------------*/
var userListTableVue = new Vue({
    el: "#userListTable",
    data: {
        pageModel: {
            pageIdx: 1,
            pageSize: 10,
            pageTotal: 0,
            pageLength: 0,
            reults: []
        },
        searchModel: {
            queryName: "",
            queryNameChs: "",
            queryEmail: "",
            queryMobile: "",
            queryCreateDate: "",
            orderByName: false,
            isAsc: true,
            isAll: true
        },
        queryString: ""
    },
    methods: {
        AddUser: function () {
            AddUserDetail(this);
        },
        EditUser: function (userID) {
            EditUserDetail(this, userID);
        },
        DeleteUser: function (userID, userName) {
            DeleteUserDetail(this, userID, userName);
        },
        GotoPage: function (toPageIdx) {
            this.pageModel.pageIdx = toPageIdx;
            ListUserForPage(this);
        },
        SearchUser: function () {
            ResetPageModel(this);
            if (this.queryString.length > 0) {
                this.searchModel.isAll = false;
            } else {
                this.searchModel.isAll = true;
            }
            this.searchModel.queryName = this.queryString;
            this.searchModel.queryNameChs = this.queryString;
            this.searchModel.queryEmail = this.queryString;
            this.searchModel.queryMobile = this.queryString;
            ListUserForPage(this);
        },
        ChangeOrderById: function (event) {
            $("a i.fa-angle-up").not(event.target).removeClass("fa-angle-down");
            $(event.target).toggleClass('fa-angle-down');
            this.searchModel.isAsc = $(event.target).hasClass('fa-angle-down') === false;
            this.searchModel.orderByName = false;
            ListUserForPage(this);
        },
        ChangeOrderByName: function (event) {
            $("a i.fa-angle-up").not(event.target).removeClass("fa-angle-down");
            $(event.target).toggleClass('fa-angle-down');
            this.searchModel.isAsc = $(event.target).hasClass('fa-angle-down') === false;
            this.searchModel.orderByName = true;
            ListUserForPage(this);
        }
    },
    created: function () {
        //页面加载前初始的数据
        InitialAztechScript();
    },
    mounted: function () {
        //页面加载后初始的数据
        ResetPageModel(this);
        ListUserForPage(this);
    },
    watch: {
        "pageModel.pageSize": function(val) {
            this.pageModel.pageIdx = 1;
            ListUserForPage(this);
        }
    }
});

/**
 * 加载所有用户
 * 请求中[v=随机数]是解决IE会缓存数据的问题
 */
function ListUserForPage(vue) {
    vue.pageModel.results = [];
    ShowAzLoading();
    
    $.ajax({
        type: "POST",
        url: "/Account/ListUserForPage?v=" + Math.random(),
        data: {
            pageModel: vue.pageModel,
            searchModel: vue.searchModel
        },
        success: function (res) {
            //console.log(res.data);
            if (res.status == "Success") {
                vue.pageModel = res.data;
            } else {
                toastr.error(res.message);
            }
            HideAzLoading();
        },
        error: function (err) {
            console.log(err);
            HideAzLoading();
            toastr.error("加载数据异常，请稍后再试或联系管理员Loading data is abnormal. Please try again later or contact the administrator。");
        }
    });
}

/**
 * 新增用户
 */
function AddUserDetail(vue) {
    OpenAzModal("新增用户New user", "/Account/Detail?IsNew=true", function () {
        ListUserForPage(vue);
    });
}

/**
 * 编辑用户
 */
function EditUserDetail(vue, userID) {
    OpenAzModal("编辑用户Edit user", "/Account/Detail?UserID=" + userID, function () {
        ListUserForPage(vue);
    });
}

/**
 * 删除所选中的用户信息
 */
function DeleteUserDetail(vue, userID, userName) {
    if (confirm("确认删除用户Confirm to delete user[" + userName + "]?")) {
        $.ajax({
            type: "POST",
            url: "/Account/DeleteUser",
            data: { "UserID": userID },
            success: function (res) {
                if (res.status === "Success") {
                    toastr.success("成功删除用户User deleted successfully[" + userName + "]。");
                    ListUserForPage(vue);
                } else {
                    toastr.error(res.message);
                }
            },
            error: function (err) {
                console.log(err);
                toastr.error("删除数据异常，请稍后再试或联系管理员The deletion of data is abnormal. Please try again later or contact the administrator。");
            }
        });
    }
}

function ResetPageModel(vue) {
    vue.pageModel.pageIdx = 1;
    vue.pageModel.pageSize = 10;
    vue.pageModel.pageLength = 0;
    vue.pageModel.pageTotal = 0;

    vue.searchModel.queryName = "";
    vue.searchModel.queryNameChs = "";
    vue.searchModel.queryEmail = "";
    vue.searchModel.queryMobile = "";
    vue.searchModel.queryCreateDate = "";
    vue.searchModel.orderByName = false;
    vue.searchModel.isAsc = true;
    vue.searchModel.isAll = true;
}
